<template>
  <div class="footer-container" style="z-index:30;">
    <van-tabbar style="z-index:30;" v-model="active">
      <van-tabbar-item icon-prefix="iconfont icon" icon="home" to="/home" name="home">首页</van-tabbar-item>
      <van-tabbar-item
        icon-prefix="iconfont icon"
        icon="digital-ocean"
        to="/section"
        name="section"
      >板块</van-tabbar-item>
      <van-tabbar-item icon-prefix="iconfont icon" icon="Edit" to="/edit" name="edit">发布</van-tabbar-item>
      <van-tabbar-item
        icon-prefix="iconfont icon"
        icon="message"
        to="/message"
        name="message"
        v-if="$store.getters.get_msgnum"
        :badge="$store.getters.get_msgnum"
      >消息</van-tabbar-item>
      <van-tabbar-item
        icon-prefix="iconfont icon"
        icon="message"
        to="/message"
        name="message"
        v-else
      >消息</van-tabbar-item>
      <van-tabbar-item
        icon-prefix="iconfont icon"
        icon="center"
        to="/account"
        name="account"
        :dot="!$store.getters.is_accountvalied"
      >我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: "my-footer",
  data() {
    return {
      active: "",
    };
  },
  mounted() {
    if (this.$route.path.startsWith("/home")) this.active = "home";
    if (this.$route.path.startsWith("/edit")) this.active = "edit";
    if (this.$route.path.startsWith("/section")) this.active = "section";
    if (this.$route.path.startsWith("/message")) this.active = "message";
    if (this.$route.path.startsWith("/account")) this.active = "account";
  },
  computed: {},
  methods: {},
};
</script>
